<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="商品名称" prop="productName">
        <el-input
          v-model="queryParams.productName"
          placeholder="请输入商品名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['management:management:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['management:management:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['management:management:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['management:management:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="managementList" @selection-change="handleSelectionChange">
      <el-table-column type="expand">
        <template slot-scope="props">
          <el-form label-position="left" inline class="demo-table-expand">
            <el-form-item label="商品类型:">
              <span>{{ props.row.type }}</span>
            </el-form-item>
            <el-form-item label="商品市场价格:">
              <span>{{ props.row.market }}</span>
            </el-form-item>
            <el-form-item label="成本价:">
              <span>{{ props.row.cost }}</span>
            </el-form-item>
            <el-form-item label="收藏:">
              <span>{{ props.row.collection }}</span>
            </el-form-item>
            <el-form-item label="虚拟销量:">
              <span>{{ props.row.virtualSalesVolume }}</span>
            </el-form-item>
          </el-form>
        </template>
      </el-table-column>
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="主键ID" align="center" prop="id" />
      <el-table-column label="商品图" align="center" prop="image" width="100">
        <template slot-scope="scope">
          <image-preview :src="scope.row.image" :width="50" :height="50"/>
        </template>
      </el-table-column>
      <el-table-column label="商品名称" align="center" prop="productName" />
      <el-table-column label="商品类型" align="center" prop="type" >
        <template slot-scope="scope">
          {{scope.row.type == 1?'普通商品':scope.row.type == 2?'卡密/网盘':scope.row.type == 3?'优惠券':'虚拟商品'}}
        </template>
      </el-table-column>
      <el-table-column label="商品售价" align="center" prop="market" />
      <el-table-column label="商品销量" align="center" prop="sales" />
      <el-table-column label="库存" align="center" prop="inventory" />
      <el-table-column label="排序" align="center" prop="sort" />
      <el-table-column label="状态" align="center" prop="status" >
        <template slot-scope="scope">
        <el-switch
          v-model="scope.row.status"
          active-color="#13ce66"
          active-text="上架"
          inactive-text="下架"
          inactive-color="#ff4949"
          :active-value="1"
          :inactive-value="0"
          @change="updateStatusB(scope.row)">
        </el-switch>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['management:management:edit']"
          >修改</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['management:management:remove']"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改商品管理表对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <template >
        <el-tabs v-model="activeName" @click="handleClick" >
          <el-tab-pane label="用户管理" name="first" default>
            <el-form-item label="商品类型" prop="type">
              <el-radio-group v-model="form.basic.type">
                <el-radio-button label="普通商品"></el-radio-button>
                <el-radio-button label="卡密/网盘"></el-radio-button>
                <el-radio-button label="优惠券"></el-radio-button>
                <el-radio-button label="虚拟商品"></el-radio-button>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="商品分类" prop="productName">
              <el-select v-model="form.basic.productClassify"  placeholder="请选择类型">
                <el-option v-for="a in productNameList" :key="a.id" :label="a.name" :value="a.name">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="商品名称" prop="productName">
              <el-input v-model="form.basic.productName" placeholder="请输入商品名称" />
            </el-form-item>
            <el-form-item label="单位" prop="unit">
              <el-input v-model="form.basic.unit" placeholder="请输入单位" />
            </el-form-item>
            <el-form-item label="商品图" prop="image">
              <image-upload v-model="form.basic.image"/>
            </el-form-item>
            <el-form-item label="添加视频" prop="addVideo">
              <el-switch
                v-model="form.basic.addVideo"
                active-color="#13ce66"
                inactive-color="#ff4949"
                :active-value="1"
                :inactive-value="0">
              </el-switch>
            </el-form-item>
            <el-form-item label="视频" prop="video" v-show="form.basic.addVideo==1">
              <el-input v-model="form.basic.video" placeholder="请输入视频" />
            </el-form-item>
            <el-form-item label="状态" prop="status">
              <el-switch
                v-model="form.basic.status"
                active-color="#13ce66"
                inactive-color="#ff4949"
                :active-value="1"
                :inactive-value="0">
              </el-switch>
            </el-form-item>
<!--            <el-form-item label="雪花id用于和其他表连接" prop="snowflakesId">-->
<!--              <el-input v-model="form.snowflakesId" placeholder="请输入雪花id用于和其他表连接" />-->
<!--            </el-form-item>-->
            <el-button @click="handleFirst">下一步</el-button>
          </el-tab-pane>
          <el-tab-pane label="规格信息" name="second">
            <el-form-item label="商品规格" prop="specProductId">
              <el-radio v-model="form.specification.specProductId" label="1" value="1">单规格</el-radio>
              <el-radio v-model="form.specification.specProductId" label="2" value="2">多规格</el-radio>
            </el-form-item>
            <el-form-item label="商品分类" prop="specName" v-if="form.specification.specProductId==2">
              <el-select v-model="form.specification.specName"  placeholder="请选择类型">
                <el-option v-for="a in specNameList" :key="a.id" :label="a.spec_name" :value="a.spec_name">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="图片" prop="image" v-if="form.specification.specProductId==1">
              <image-upload v-model="form.specification.image"/>
            </el-form-item>
            <el-form-item label="商品售价" prop="market" v-if="form.specification.specProductId==1">
              <el-input v-model="form.specification.market" placeholder="请输入商品售价" />
            </el-form-item>
            <el-form-item label="成本价" prop="cost" v-if="form.specification.specProductId==1">
              <el-input v-model="form.specification.cost" placeholder="请输入成本价" />
            </el-form-item>
            <el-form-item label="原价" prop="price" v-if="form.specification.specProductId==1">
              <el-input v-model="form.specification.price" placeholder="请输入商品市场价格" />
            </el-form-item>
            <el-form-item label="库存" prop="inventory" v-if="form.specification.specProductId==1">
              <el-input v-model="form.specification.inventory" placeholder="请输入库存" />
            </el-form-item>
            <el-form-item label="重量" prop="weight" v-if="form.specification.specProductId==1">
              <el-input v-model="form.specification.weight" placeholder="请输入重量" />
            </el-form-item>
            <el-form-item label="体积" prop="volume" v-if="form.specification.specProductId==1">
              <el-input v-model="form.specification.volume" placeholder="请输入体积" />
            </el-form-item>
            <el-button @click="PreviousSecond">上一步</el-button>
            <el-button @click="handleSecond">下一步</el-button>
          </el-tab-pane>
          <el-tab-pane label="商品详情" name="third">
            <el-form-item label="详情">
              <editor v-model="form.details.detail" :min-height="192"/>
            </el-form-item>
            <el-button @click="PreviousThird">上一步</el-button>
            <el-button @click="handleThird">下一步</el-button>
          </el-tab-pane>
          <el-tab-pane label="物流信息" name="fourth">
            <el-form-item label="物流方式" prop="Logistics">
              <el-checkbox v-model="form.logistics.Logistics"  value="快递">快递</el-checkbox>
              <el-checkbox v-model="form.logistics.Logistics"  value="到店核销">到店核销</el-checkbox>
            </el-form-item>
            <el-form-item label="邮费设置" prop="postage">
              <el-radio v-model="form.logistics.postage" label="1">固定邮费</el-radio>
              <el-radio v-model="form.logistics.postage" label="2">运费模版</el-radio>
            </el-form-item>
            <el-form-item label="邮费金额" prop="template" v-if="form.logistics.postage == 1">
              <el-input v-model="form.logistics.amount" placeholder="请输入邮费金额" />
            </el-form-item>
            <el-form-item label="运费模板" prop="template" v-if="form.logistics.postage == 2">
              <el-select v-model="form.logistics.template" placeholder="请选择模版">
                <el-option label="默认模版" value="template"></el-option>
                <el-option label="模版1" value="template"></el-option>
              </el-select>  <span class="blue-text" @click="yffrom()">新增运费模版</span>
            </el-form-item>
            <el-form-item label="模板名称" prop="templateName" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.templateName" placeholder="请输入模板名称" />
            </el-form-item>
            <el-form-item label="计费方式" prop="billing" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.billing" placeholder="请输入方式" />
            </el-form-item>
            <el-form-item label="可配送区域" prop="distribution" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.distribution" placeholder="请输入可配送区域" />
            </el-form-item>
            <el-form-item label="首件" prop="firstPiece" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.firstPiece" placeholder="请输入首件"  />
            </el-form-item>
            <el-form-item label="运费" prop="freight" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.freight" placeholder="请输入运费" />
            </el-form-item>
            <el-form-item label="续件" prop="continued" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.continued" placeholder="请输入续件" />
            </el-form-item>
            <el-form-item label="续费" prop="renewal" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.renewal" placeholder="请输入续费" />
            </el-form-item>
            <el-form-item label="包邮区域" prop="freeShippingArea" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.freeShippingArea" placeholder="请输入包邮区域" />
            </el-form-item>
            <el-form-item label="不送达区域" prop="undeliveredRegions" v-if="form.logistics.postage == 2">
              <el-input v-model="form.logistics.undeliveredRegions" placeholder="请输入不送达区域" />
            </el-form-item>
            <el-button @click="PreviousFourth">上一步</el-button>
            <el-button @click="handleFourth">下一步</el-button>
          </el-tab-pane>
          <el-tab-pane label="营销设置" name="five">
            <el-form-item label="已销数量" prop="sales">
              <el-input v-model="form.marketing.sales" placeholder="请输入商品销量" />
            </el-form-item>
            <el-form-item label="排序" prop="sort">
              <el-input v-model="form.marketing.sort" placeholder="请输入排序" />
            </el-form-item>
            <el-form-item label="购买送积分" prop="integral">
              <el-input v-model="form.marketing.integral" placeholder="请输入购买送积分" />
            </el-form-item>
            <el-form-item label="购买送优惠卷">
              <el-button type="primary">添加送优惠卷</el-button>
            </el-form-item>
            <el-form-item label="关联用户标签" prop="associateUserTags">
              <el-select v-model="form.marketing.associateUserTags" placeholder="请选择标签">
                <el-option label="标签1" value="associateUserTags"></el-option>
                <el-option label="标签2" value="associateUserTags"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="付费会员专属" prop="exclusiveToPaidMembers">
              <el-switch
                v-model="form.marketing.exclusiveToPaidMembers"
                active-color="#13ce66"
                inactive-color="#ff4949"
                active-value="1"
                inactive-value="2">
              </el-switch>
            </el-form-item>
            <el-form-item label="单独设置">
              <el-radio v-model="form.marketing.ddsz" label="1">佣金设置</el-radio>
              <el-radio v-model="form.marketing.ddsz" label="2">付费会员价</el-radio>
            </el-form-item>


            <el-form-item label="批量设置" v-if="form.marketing.ddsz == 1">
              一级返佣:<el-input v-model="form.marketing.yjfy" style="width: 20%;"></el-input>
              二级返佣:<el-input v-model="form.marketing.ejfy" style="width: 20%;"></el-input>
            </el-form-item>

            <el-form-item label="批量设置" v-if="form.marketing.ddsz == 2">
              一级返佣:<el-input v-model="form.marketing.yjfy" style="width: 20%;"></el-input>
              二级返佣:<el-input v-model="form.marketing.ejfy" style="width: 20%;"></el-input>
              会员价:<el-input v-model="form.marketing.hyj" style="width: 20%;"></el-input>
            </el-form-item>
            <el-form-item label="起购数量" prop="minimumPurchaseQuantity">
              <el-input v-model="form.marketing.minimumPurchaseQuantity" placeholder="请输入起购数量" />
            </el-form-item>
            <el-form-item label="是否限购" prop="purchase">
              <el-switch
                v-model="form.marketing.purchase"
                active-color="#13ce66"
                inactive-color="#ff4949"
                :active-value="1"
                :inactive-value="0">
              </el-switch>
            </el-form-item>
            <el-form-item label="限购类型" prop="purchaseRestrictionType" v-if="form.marketing.purchase==1">
              <el-radio v-model="form.marketing.purchaseRestrictionType" label="1">单人限购</el-radio>
              <el-radio v-model="form.marketing.purchaseRestrictionType" label="2">单次限购</el-radio>
            </el-form-item>
            <el-form-item label="限购数量" prop="purchaseLimit" v-if="form.marketing.purchase==1">
              <el-input v-model="form.marketing.purchaseLimit" placeholder="请输入限购数量" style="width: 10%;" /> <span>件</span>
            </el-form-item>
            <el-form-item label="预售商品" prop="preSale">
              <el-switch
                v-model="form.marketing.preSale"
                active-color="#13ce66"
                inactive-color="#ff4949"
                :active-value="1"
                :inactive-value="0">
              </el-switch>
            </el-form-item>
            <el-form-item label="预售活动开始时间" prop="preSaleStarttime" v-if="form.marketing.preSale==1">
              <el-date-picker clearable
                              v-model="form.marketing.preSaleStarttime"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="请选择预售活动开始时间">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="预售活动结束时间" prop="preSaleEndtime" v-if="form.marketing.preSale==1">
              <el-date-picker clearable
                              v-model="form.marketing.preSaleEndtime"
                              type="date"
                              value-format="yyyy-MM-dd"
                              placeholder="请选择预售活动结束时间">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="发货时间" prop="shippingTime" v-if="form.marketing.preSale==1">
              <span>预售活动结束后</span>  <el-input v-model="form.marketing.shippingTime" placeholder="请输入发货时间" style="width: 10%;"/><span>天之内</span>
            </el-form-item>
            <el-form-item label="商品推荐" prop="productRecommendations">
              <el-checkbox v-model="form.marketing.productRecommendations"  value="热卖单品">热卖单品</el-checkbox>
              <el-checkbox v-model="form.marketing.productRecommendations"  value="促销单品">促销单品</el-checkbox>
              <el-checkbox v-model="form.marketing.productRecommendations"  value="精品推荐">精品推荐</el-checkbox>
              <el-checkbox v-model="form.marketing.productRecommendations"  value="首发新品">首发新品</el-checkbox>
              <el-checkbox v-model="form.marketing.productRecommendations"  value="优品推荐">优品推荐</el-checkbox>
            </el-form-item>
            <el-form-item label="活动优先级" prop="activityPriority">
              <el-button type="danger" v-model="form.marketing.activityPriority">默认</el-button>
              <el-button type="primary" v-model="form.marketing.activityPriority">秒杀</el-button>
              <el-button type="success" v-model="form.marketing.activityPriority">砍价</el-button>
              <el-button type="warning" v-model="form.marketing.activityPriority">拼团</el-button>
              <h5>可拖动按钮调整活动的优先级展示顺序</h5>
            </el-form-item>
            <el-button @click="PreviousFive">上一步</el-button>
            <el-button @click="handleFive">下一步</el-button>
          </el-tab-pane>
          <el-tab-pane label="其他设置" name="six">
            <el-form-item label="商品关键字" prop="productKeywords">
              <el-input v-model="form.other.productKeywords" placeholder="请输入商品关键字" />
            </el-form-item>
            <el-form-item label="商品简介" prop="productDescription">
              <el-input v-model="form.other.productDescription" placeholder="请输入商品简介" />
            </el-form-item>
            <el-form-item label="商品口令" prop="productPassword">
              <el-input v-model="form.other.productPassword" placeholder="请输入商品口令" />
            </el-form-item>
            <el-form-item label="商品推荐图" prop="productRecommendationImage">
              <image-upload v-model="form.other.productRecommendationImage"/>
            </el-form-item>
          </el-tab-pane>
        </el-tabs>
      </template>
<!--        <el-form-item label="收藏" prop="collection">-->
<!--          <el-input v-model="form.collection" placeholder="请输入收藏" />-->
<!--        </el-form-item>-->
<!--        <el-form-item label="虚拟销量" prop="virtualSalesVolume">-->
<!--          <el-input v-model="form.virtualSalesVolume" placeholder="请输入虚拟销量" />-->
<!--        </el-form-item>-->
      </el-form>
      <div slot="footer" class="dialog-footer" v-if="activeName=='six'">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="PreviousSix">上一步</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import axios from "axios"
import { listManagement, getManagement, delManagement, addManagement, updateManagement,listProduct,listSpecManagement,updateStatus } from "@/api/management/management";
import {listProduct_category} from "@/api/product_category/product_category";

export default {
  name: "Management",
  data() {
    return {
      // 遮罩层
      loading: true,
      activeName: 'first',
      // 选中数组
      ids: [],
      updateStatusBasic:{
        id:null,
        status:null
      },
      // 非单个禁用
      single: true,
      productNameList:[],
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      specNameList:[],
      // 商品管理表表格数据
      managementList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        productName: null,
        type: null,
      },
      // 表单参数
      form: {
        basic:{
          id: null,
          type: null,
          productName: null,
          unit: null,
          image: null,
          addVideo: null,
          video: null,
          status: null,
          basicSnowflakesId: null,
          collection: null,
          virtualSalesVolume: null,
          productClassify: null
        },
        details:{
          id: null,
          detail: null,
          snowflakesId: null
        },
        logistics:{
          id: null,
          Logistics: null,
          postage: null,
          template: null,
          templateName: null,
          billing: null,
          distribution: null,
          firstPiece: null,
          freight: null,
          continued: null,
          renewal: null,
          designatedFreeShipping: null,
          freeShippingArea: null,
          specifyNotDelivered: null,
          undeliveredRegions: null,
          snowflakesId: null,
          amount: null
        },
        marketing:{
          id: null,
          sales: null,
          sort: null,
          integral: null,
          associateUserTags: null,
          exclusiveToPaidMembers: null,
          minimumPurchaseQuantity: null,
          purchase: null,
          purchaseRestrictionType: null,
          purchaseLimit: null,
          preSale: null,
          preSaleStarttime: null,
          preSaleEndtime: null,
          shippingTime: null,
          productRecommendations: null,
          activityPriority: null,
          snowflakesId: null,
          ddsz: null,
          yjfy: null,
          ejfy: null,
          hyj: null
        },
        other:{
          id: null,
          productKeywords: null,
          productDescription: null,
          productPassword: null,
          productRecommendationImage: null,
          snowflakesId: null
        },
        specification:{
          id: null,
          image: null,
          market: null,
          cost: null,
          price: null,
          inventory: null,
          snowflakesId: null,
          weight: null,
          volume: null,
          specProductId: '1',
          specName: null
        }
      },
      // 表单校验
      rules: {
      }
    };
  },
  created() {
    this.getList();
    this.getTreeselect();
    this.getSpecNameList();
    this.form.specProductId='1'
  },
  methods: {
    removeBackslashes(str) {
      // 使用 replace 方法去除所有的反斜杠
      return str.replace(/<[^>]*>/g, '');
    },
    updateStatusB(row){
      this.updateStatusBasic.id=row.id;
      this.updateStatusBasic.status=row.status;
      updateStatus(this.updateStatusBasic).then(res=>{
        this.getList();
      })
    },
    PreviousSecond(){
      this.activeName='first';
    },
    handleFirst(){
      this.activeName='second';
    },
    handleSecond(){
      this.activeName='third';
    },
    PreviousThird(){
      this.activeName='second';
    },
    handleThird(){
      this.activeName='fourth';
    },
    PreviousFourth(){
      this.activeName='third';
    },
    handleFourth(){
      this.activeName='five';
    },
    handleFive(){
      this.activeName='six';
    },
    PreviousFive(){
      this.activeName='fourth';
    },
    PreviousSix(){
      this.activeName='five';
    },
    /** 查询商品管理表列表 */
    getList() {
      this.loading = true;
      listManagement(this.queryParams).then(response => {
        this.managementList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    getTreeselect() {
      listProduct().then(res => {
        this.productNameList=res
      })
    },
    getSpecNameList(){
      listSpecManagement().then(res => {
        this.specNameList=res
      })
    },
    handleClick(val) {
      this.activeName= val
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        basic:{
          id: null,
          type: null,
          productName: null,
          unit: null,
          image: null,
          addVideo: null,
          video: null,
          status: null,
          basicSnowflakesId: null,
          collection: null,
          virtualSalesVolume: null,
          productClassify: null
        },
        details:{
          id: null,
          detail: null,
          snowflakesId: null
        },
        logistics:{
          id: null,
          Logistics: null,
          postage: null,
          template: null,
          templateName: null,
          billing: null,
          distribution: null,
          firstPiece: null,
          freight: null,
          continued: null,
          renewal: null,
          designatedFreeShipping: null,
          freeShippingArea: null,
          specifyNotDelivered: null,
          undeliveredRegions: null,
          snowflakesId: null,
          amount: null
        },
        marketing:{
          id: null,
          sales: null,
          sort: null,
          integral: null,
          associateUserTags: null,
          exclusiveToPaidMembers: null,
          minimumPurchaseQuantity: null,
          purchase: null,
          purchaseRestrictionType: null,
          purchaseLimit: null,
          preSale: null,
          preSaleStarttime: null,
          preSaleEndtime: null,
          shippingTime: null,
          productRecommendations: null,
          activityPriority: null,
          snowflakesId: null,
          ddsz: null,
          yjfy: null,
          ejfy: null,
          hyj: null
        },
        other:{
          id: null,
          productKeywords: null,
          productDescription: null,
          productPassword: null,
          productRecommendationImage: null,
          snowflakesId: null
        },
        specification:{
          id: null,
          image: null,
          market: null,
          cost: null,
          price: null,
          inventory: null,
          snowflakesId: null,
          weight: null,
          volume: null,
          specProductId: null,
          specName: null
        }
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加商品管理表";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      this.getTreeselect();
      const id = row.id || this.ids
      getManagement(id).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改商品管理表";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.basic.id != null) {
            updateManagement(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            this.form.details=this.removeBackslashes(this.form.details)
            addManagement(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal.confirm('是否确认删除商品管理表编号为"' + ids + '"的数据项？').then(function() {
        return delManagement(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('management/management/export', {
        ...this.queryParams
      }, `management_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>
